// 通用图表组件样式
.universal-chart-container {
  width: 100%;
  height: 100%; // 继承父容器高度
  padding: 16px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  box-sizing: border-box; // 确保padding包含在高度计算内

  // 图表容器样式
  .echarts-container {
    width: 100%;
    height: auto; // 由最小高度支撑初始尺寸
    min-height: var(--chart-min-height, 560px); // 可通过CSS变量覆盖最小高度
    overflow: hidden;

    // 图表标题样式优化
    .echarts-title {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    }
  }

  // 加载状态样式
  .ant-spin-nested-loading {
    height: auto;
    min-height: var(--chart-min-height, 560px);

    .ant-spin-container {
      height: auto;
      display: flex;
      flex-direction: column;
    }
  }
}

// 响应式设计
@media (max-width: 768px) {
  .universal-chart-container {
    padding: 8px;

    .echarts-container {
      min-height: var(--chart-min-height-sm, 300px);
    }
  }
}